<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>分类</title>
    <link rel="stylesheet" type="text/css" href="../iconfonts/iconfont.css" />
    <link rel="stylesheet" href="../css/common1.css">
    <link rel="stylesheet" href="../css/category.css">
    <!-- 品类 -->


    <script src="../lib/jquery-1.11.3.min.js"></script>
    <script src="../js/api.js" type="text/javascript" charset="utf-8"></script>
    <script src="../lib/adaptive.js"></script>
    <script src="../lib/js.cookie.js"></script>
    <script src="../js/category.js" type="text/javascript" charset="utf-8"></script>
</head>

<body>
    <header>
        <input type="text" placeholder="搜索分类、品牌、商品">
        <a class="iconfont icon-sousuo1"></a>
    </header>
    <nav>
        <input type="button" name="" id="" value="品类" />
        <input type="button" name="" id="" value="品牌馆" />
    </nav>


    <section id="pinLei">
        <div class="section-l pinLei">
            <ul>
                <!-- <li>女款时尚</li>
					<li>男款精品</li>
					<li>护肤彩妆</li>
					<li>时尚运动</li>
					<li>潮流配饰</li>
					<li>孩童母婴</li>
					<li>生活家居</li>
					<li>食品保健</li> -->
            </ul>
        </div>

        <div class="pL-section-r">
            <div class="pL-s-r-banner">
                <img src="../img/02.jpg" alt="">
            </div>



            <div id="pL-s-r-cont">
                <!--<div class="pL-s-r-title">
						<span></span>
						<p>裙装</p>
						<span></span>
					</div>
					<div class="pL-s-r-cont">
						<dl>
							<dt>
								<img src="#" alt="">
							</dt>
							<dd>
								<p>年后</p>
							</dd>
						</dl>
					</div> -->
            </div>



        </div>


    </section>

    <section id="pinPai" style="display: none;">
        <div class="section-l pinPai">
            <!-- <ul>
					<li><a href="">热门</a></li>
					<li><a href="">A-Z</a></li>
					<li><a href="">按分类</a></li>
					<li><a href="">按风格</a></li>
					<li><a href="">按地区</a></li>
				</ul> -->
            <ul>
                <li>热门</li>
                <li>A-Z</li>
                <li>按分类</li>
                <li>按风格</li>
                <li>按地区</li>
            </ul>
        </div>





        <div class="pP-section-r">
            <div class="pP-s-r-banner">
                <div id="" class="pP-s-r-b-img">
                    <div id="" class="pP-s-r-b-i-cont">
                        <h2>1000+MORM</h2>
                        <p>全球时尚潮流品牌</p>
                    </div>
                </div>

            </div>



            <div class="pP-s-r-cont">

                <!-- <div class="s-r-c-img">
						<a href="#">
							<img src="../img/logo2.jpg">
						</a>
					</div>-->



            </div>

        </div>


    </section>



    <footer>
        <figure>
            <a href="#" class="iconfont icon-shouye"></a>
            <figcaption>精选</figcaption>
        </figure>
        <figure style="margin-right: 1.2rem;">
            <a href="#" class="iconfont icon-sousuo"></a>
            <figcaption>分类</figcaption>
        </figure>

        <img src="../img/hong1.jpg" style="height: 1.48rem;width: 1.48rem" />

        <figure style="margin-left: 1.2em;">
            <a href="#" class="iconfont icon-gouwuche"></a>
            <figcaption>购物车</figcaption>
        </figure>
        <figure>
            <a href="#" class="iconfont icon-wode"></a>
            <figcaption>我的</figcaption>
        </figure>
    </footer>
    <script type="text/javascript">
        categroy();


        $("footer img").hover(function() {
            $('footer img').prop("src", '../img/hong1.jpg');
        }, function() {
            $("footer img").prop("src", "../img/tutu.jpg");
        })
        $("footer figure").hover(function(e) {
            let time = $(this).index()
            if ($(this).index() > 2) {
                time--
            }
            $('footer figure .iconfont').eq(time).css({
                color: '#000'
            });
            $('footer figure figcaption').eq(time).css({
                color: '#000'
            });
        }, function() {
            $('footer figure .iconfont').css({
                color: '#999'
            });
            $('footer figure figcaption').css({
                color: '#999'
            });
        })
    </script>
</body>

</html>